import React from 'react';
import { Breadcrumb } from 'antd';
import { useNavigate,useLocation ,NavLink} from "react-router-dom";
import router from "@/router/index.tsx"
const breadcrumbStyle: React.CSSProperties = {
    textAlign: 'left',
    backgroundColor: '#fff',
    padding:'0px 20px',
    height:'50px',
    display:'flex',
    alignItems:'center',
    margin:'10px',
    borderRadius:'5px'
};
const getLocation = () => {
    let location = useLocation().pathname.split('/').filter(r=>r)
    let item = JSON.parse(JSON.stringify(location)).map((r,index)=>{
        let data = ''
        if(index+1 < location.length){
            console.log(index,12313123)
            for(let i = 0; i < index+1;i++){
                data = data + "/" + location[i]
            }
            return {
                title:<NavLink to={data}>{location[index]}</NavLink>
            }
        }else{
            return {
                title:location[index]
            }
        }
        
    })
    return item
}
const BreadCrumb: React.FC = () => {
    const item = getLocation()
    return (
        <Breadcrumb
            style={breadcrumbStyle}
            items={item}
        />
    );
};
export default BreadCrumb;